<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1.0"/>
		<link rel="stylesheet" type="text/css" href="bootstrap-4.6.2-dist/css/bootstrap.min.css"/>
		<link href="css/indext.css" rel="stylesheet" />
		<title>Xiao Shuo</title>
		<script src="bootstrap-4.6.2-dist/js/jquery-3.5.1.slim.min.js"></script>
		<script src="bootstrap-4.6.2-dist/js/bootstrap.min.js"></script>
	</head>
	<body>
		<div class="container">
			<nav class="navbar navbar-expand-sm bg-white navbar-light">
			<ul class="navbar-nav ml-auto">
				<a class="navbar-brand text-danger" href="#">起点中文网 </a>
			<form class="form-inline my-2 my-lg-0 ml-auto">
				<input class="form-control mr-sm-0" type="search" placeholder="search" aria-label="search"/>
				<button class="btn btn-danger mr-3 " type="search">搜索</button>
				<a href="#" class="mr-2">登录/注册</a>
			</form>
			</ul>
		</nav>
		</div>
		<nav class="navbar navbar-expand-sm bg-dark navbar-dark">
			<div class="container">
			<ul class="navbar-nav">
				<li class="nav-item">
				<a class="nav-link active" href="indext1.html">主页</a>
				</li>
				<li class="nav-item">
				<a class="nav-link" href="index2.html">排行</a>
				</li>
				<li class="nav-item">
				<a class="nav-link" href="index3.html">免费</a>
				</li>
				<li class="nav-item">
				<a class="nav-link" href="#">人气榜</a>
				</li>
				<li class="nav-item dropdown">
			        <a class="nav-link dropdown-toggle" href="#" role="button" data-toggle="dropdown" aria-expanded="false">
			          更多
			        </a>
			        <div class="dropdown-menu">
			          <a class="dropdown-item" href="#">Action</a>
			          <a class="dropdown-item" href="#">Another action</a>
			          <a class="dropdown-item" href="#">Something else here</a>
			        </div>
			      </li>
			</ul>
			</div>
		</nav>
		
		<div class="container">
			<div class="row mt-2">
				<div class="col-md-3 border">
					<h3>本周强推</h3>
					<p>1<a href="#" class="text-secondary">[都市]</a>我的郁金香小姐</p>
					<p>2<a href="#" class="text-secondary">[都市]</a>我的26岁女房客</p>
					<p>3<a href="#" class="text-secondary">[古侠经典]</a>剑来</p>
					<p>4<a href="#" class="text-secondary">[异术超能]</a>我在风花雪月等你</p>
					<p>5<a href="#" class="text-secondary">[都市脑洞]</a>异兽迷城</p>
					<p>6<a href="#" class="text-secondary">[悬疑脑洞]</a>十日终焉</p>
					<p>7<a href="#" class="text-secondary">[修仙]</a>一念永恒</p>
					<p>8<a href="#" class="text-secondary">[武侠]</a>雪中悍刀行</p>
				</div>
				
				<div class="col-md-6">
			<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel" data-interval = "2000">
				<!--指示器-->
			  <ol class="carousel-indicators">
			    <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
			    <li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
			    <li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
			  </ol>
			  <div class="carousel-inner">
			    <div class="carousel-item active">
			      <img src="img/xuanhuan1.png" class="d-block w-100" alt="..." height="350px">
			    </div>
			    <div class="carousel-item">
			      <img src="img/xuanhuan.png" class="d-block w-100" alt="..." height="350px">
			    </div>
			    <div class="carousel-item">
			      <img src="img/xuanhuan2.png" class="d-block w-100" alt="..." height="350px">
			    </div>
			  </div>
			  <!--左右切换-->
			  <button class="carousel-control-prev" type="button" data-target="#carouselExampleIndicators" data-slide="prev">
			    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
			    <span class="sr-only">Previous</span>
			  </button>
			  <button class="carousel-control-next" type="button" data-target="#carouselExampleIndicators" data-slide="next">
			    <span class="carousel-control-next-icon" aria-hidden="true"></span>
			    <span class="sr-only">Next</span>
			  </button>
			</div>
			</div>
			<div class="col-md-3 border" style="font-size: 20px;">
				<h3>热度作者榜</h3>
				<p>1<a href="#">耳根</a></p>
				<p>2<a href="#">烽火戏诸侯</a></p>
				<p>3<a href="#">超级大坦克科比</a></p>
				<p>4<a href="#">天蚕土豆</a></p>
				<p>5<a href="#">会说话的肘子</a></p>
				<p>6<a href="#">我吃西红柿</a></p>
			</div>
			</div>
		</div>
		<br/>
		<div class="container">
			<ul class="nav nav-tabs justify-content-end">
			<li class="nav-item">
				<a class="nav-link active" data-toggle = "tab" href="#xuanhuan">玄幻</a>
			</li>
			<li class="nav-item">
				<a class="nav-link" data-toggle = "tab" href="#kehuan">科幻</a>
			</li>
			<li class="nav-item">
				<a class="nav-link" data-toggle = "tab" href="#dushi">都市</a>
			</li>
		</ul>
			<h3>畅销推荐</h3>
			<div class="tab-content">
				<div class=" tab-pane fade show active" id="xuanhuan">
					<div class="row border">
					 	<div class="col-md-2"><img src="img/xuanhuan1.png" height="200px"> </div>
							<div class="col-md-10">
								<p>作者：辰东</p>
								<p>主角：叶凡</p>
							<p>冰冷与黑暗并存的宇宙深处，九具庞大的龙尸拉着一口青铜古棺，
							亘古长存。这是太空探测器在枯寂的宇宙中捕捉到的一幅极其震撼的画
							面。九龙拉棺，究竟是回到了上古，还是来到了星空的彼岸？一个浩大的
							仙侠世界，光怪陆离，神秘无尽。热血似火山沸腾，激情若瀚海汹涌，
							欲望如深渊无止境……登天路，踏歌行，弹指遮天。
							</p>
							</div>
					</div>
					<div class="row border">
					 	<div class="col-md-2"><img src="img/xuanhuan.png" height="200px"> </div>
							<div class="col-md-10">
								<p>作者：辰东</p>
								<p>主角：石昊</p>
							<p>一粒尘可填海，一根草斩尽日月星辰，弹指间天翻地覆。
								群雄并起，万族林立，诸圣争霸，乱天动地。问苍茫大地，谁主沉浮？！
								一个少年从大荒中走出，一切从这里开始……
							</p>
							</div>
					</div>
					<div class="row border">
					 	<div class="col-md-2"><img src="img/xuanhuan2.png"height="200px" > </div>
							<div class="col-md-10">
								<p>作者：辰东</p>
								<p>主角：楚风</p>
							<p>在破败中崛起，在寂灭中复苏。
							沧海成尘，雷电枯竭，那一缕幽雾又一次临近大地，
							世间的枷锁被打开了，一个全新的世界就此揭开神秘的一角……
							</p>
							</div>
					</div>
					
					</div>
					<div class=" tab-pane fade" id="kehuan">
					<div class="row border">
					 	<div class="col-md-2"><img src="img/lunbo1.png"height="200px" > </div>
							<div class="col-md-10">
								<p>作者：会说话的肘子</p>
								<p>主角：庆尘</p>
							<p>蓝与紫的霓虹中，浓密的钢铁苍穹下，数据洪流的前端，是科技革命之后
								的世界，也是现实与虚幻的分界。 钢铁与身体，过去与未来。 这里，表世界与里世界并存
								，面前的一切，像是时间之墙近在眼前。 黑暗逐渐笼罩。 可你要明白啊我的朋友
								，我们不能用温柔去应对黑暗，要用火。
							</p>
							</div>
					</div>
					<div class="row border">
					 	<div class="col-md-2"><img src="img/lunbo2.png"height="200px" > </div>
							<div class="col-md-10">
								<p>作者：会说话的肘子</p>
								<p>主角：任小粟</p>
							<p>废土之上，人类文明得以苟延残喘。 一座座壁垒拔地而起，秩序却不断崩坏。 有人说，当灾难降临时，精神意志才是人类面对危险的第一序列武器。
								 有人说，不要让时代的悲哀，成为你的悲哀。
								  有人说，我要让我的悲哀，成为这个时代的悲哀。 
								  这次是一个新的故事。 浩劫余生，终见光明。
							</p>
							</div>
					</div>
					<div class="row border">
					 	<div class="col-md-2"><img src="img/lunbo3.png"height="200px" > </div>
							<div class="col-md-10">
								<p>作者：会说话的肘子</p>
								<p>主角：吕树</p>
							<p>高中生吕树在一场车祸中改变人生，当灵气复苏时代来袭，
								他要做这时代的领跑者。 物竞天择，胜者为王。 ……
							</p>
							</div>
					</div>
					</div>
					<div class=" tab-pane fade" id="dushi">
						<div class="row border">
						<div class="col-md-2"><img src="img/dushi1.png"height="200px" > </div>
							<div class="col-md-10">
								<p>作者：超级大坦克科比</p>
								<p>主角：江桥</p>
							<p>深圳顶级二代，艺术学院千金校花，当红女主播，青梅指腹为婚海归女博士！
								 开局没钱？别慌熬一熬，亿万老妈马上来！ 
								 一男多女主极品爽文，一切尽在——《我的郁金香小姐》
							</p>
							</div>
					</div>
					<div class="row border">
					<div class="col-md-2"><img src="img/dushi.png"height="200px" > </div>
							<div class="col-md-10">
								<p>作者：超级大坦克科比</p>
								<p>主角：昭阳</p>
							<p>酒吧疯狂一夜，被美女讹上，落魄青年喜当爹。屋漏偏逢连夜雨，租住的房子换了主人，就要被扫地出门，不过新房东是个美女啊！
								要不要考虑合租？只见美女轻飘飘说了一个字，滚！ 因租房问题而起的情感纠葛。
							</p>
							</div>
					</div>
					<div class="row border">
					<div class="col-md-2"><img src="img/dushi2.png"height="200px" > </div>
							<div class="col-md-10">
								<p>作者：柳岸花又明 </p>
								<p>主角：陈汉升</p>
							<p>万万没想到，社会精英、钻石单身汉的陈汉升居然重生了，一觉醒来变成了高三毕业生。
								 十字路口的陈汉升也在犹豫，宝藏女孩沈幼楚和白月光萧容鱼，应该选择谁？ 
								都市重生小说的天花板，年轻人绝对不可错失的恋爱宝典！
							</p>
							</div>
					</div>
					</div>
		</div>
		</div>
		<footer class="text-center bg-dark text-light w-100">
				<p class="mb-0">阅文集团旗下网站： 起点中文网 起点女生网 QQ阅读 阅文悦读 书单 庆余年专题站  
							关于起点 联系我们 加入我们 帮助与客服 举报中心 漏洞提交</p>
				<p> <span class="text-warning ">起点小说网</span>版权所有</p>
				<img src="img/111.png" />
		</footer>
	</body>
</html>
